<script  lang="ts" setup>
import { ref } from 'vue';

</script>

<template>
    <div class="scroll-view">
        <div class="scroll-view-top">
             <slot key="scrollViewTop" name="scrollViewTop"></slot>
        </div>
        <div class="scroll-view-content"> 
            <slot key="scrollViewContent" name="scrollViewContent"></slot>
        </div>
        <div class="scroll-view-bottom">
             <slot key="scrollViewBottom" name="scrollViewBottom"></slot>
        </div>
    </div>
</template>
<style lang="less" scoped> 
.scroll-view{
    height: 100vh;
    display: flex;
    flex-direction:column;
   
    .scroll-view-content{
        flex: 1;
        overflow: auto;
    }
}
</style>